<template>
  <div class="app-container">
    <!-- 添加或修改租户组件功能点主表对话框 -->
      <el-form ref="mainRef" :model="form"  label-width="auto">
        <el-form-item label="类名" prop="className">
          <el-input v-model="form.className" placeholder="请输入类名" disabled />
        </el-form-item>
        <el-form-item label="函数编码" prop="functionCode">
          <el-input v-model="form.functionCode" placeholder="请输入函数编码" disabled />
        </el-form-item>
        <el-form-item label="函数名称" prop="functionName">
          <el-input v-model="form.functionName" placeholder="请输入函数名称" />
        </el-form-item>
        <el-form-item label="功能描述" prop="functionDesc">
          <el-input v-model="form.functionDesc" placeholder="请输入功能描述" />
        </el-form-item>
        <el-form-item label="排序号" prop="sortNumber">
          <el-input-number v-model="form.sortNumber" :controls="false" placeholder="请输入排序号"  />
        </el-form-item>
        <el-form-item label="是否有返回值" prop="isReturnvalue">
          <el-switch
              v-model="form.isReturnvalue"
              style="--el-switch-on-color: #13ce66; --el-switch-off-color: #ff4949"
              active-value="Y"
              inactive-value="N"
          />
        </el-form-item>
        <el-form-item label="返回值类型" prop="returnType"  v-if="form.isReturnvalue === 'Y'">
          <el-input v-model="form.returnType" placeholder="请输入返回值类型" />
        </el-form-item>
        <el-form-item label="修改说明" prop="commitMessage">
          <el-input v-model="form.commitMessage" placeholder="请修改说明" />
        </el-form-item>
        <el-form-item>
          <el-button type="primary"  @click="updateMain">确定</el-button>
        </el-form-item>
      </el-form>
  </div>
</template>

<script setup lang="ts">
import {getCurrentInstance,  ref, watch} from "vue";

const { proxy } = getCurrentInstance();
const props = defineProps(['modelValue'])
const emit = defineEmits(['update:modelValue'])

// 初始化所有可能字段
const form = ref({
  className: '',
  functionCode: '',
  functionName: '',
  functionDesc: '',
  isReturnvalue: 'N',
  returnType: '',
  commitMessage: '',
  sortNumber:0
})

function updateMain() {
   emit('update:modelValue', form.value)
}
watch(
    () => props.modelValue,
    (newVal) => {
      if(newVal.className!="") {
        // 直接赋值新值，保持响应性
        Object.assign(form.value, newVal || {})
        console.log("tenantfunctionmain watch:", JSON.stringify(form.value))
      }else{
        console.log("newVal.className==''")

      }
    },
    { deep: true, immediate: true }
)
</script>
